<template>
    <div>
        <el-form :inline="true" :model="SearchForm"
                 class="demo-form-inline" style="height: 50px" v-if="roleId===1">
            <el-form-item label="饭店名" >
                <el-input
                        v-model="SearchForm.restaurantName"
                        placeholder="根据饭店名查询">
                </el-input>
            </el-form-item>

            <el-form-item>
                <el-button type="primary" @click="initTable">查询</el-button>
                <el-button type="primary" @click="reback">重置</el-button>
            </el-form-item>
        </el-form>

        <!-- 查询全部评论-->
        <el-table
                :data="SayTable"
                border
                style="width: 100%"
                :header-cell-style="getRowClass">
            <el-table-column
                    prop="pinglunid"
                    label="评论编号">
            </el-table-column>
            <el-table-column
                    prop="dishName"
                    label="菜名">
            </el-table-column>
            <el-table-column
                    prop="restaurant.restaurantName"
                    label="餐厅名">
            </el-table-column>
            <el-table-column
                    prop="say"
                    label="评论内容">
            </el-table-column>
            <el-table-column
                    prop="usermonicker"
                    label="用户昵称">
            </el-table-column>
            <el-table-column
                    prop="saytime"
                    label="评论时间">
            </el-table-column>

            <el-table-column
                    fixed="right"
                    label="操作"
                    >
                <template slot-scope="scope">
                    <el-button type="danger" @click="del(scope.row.pinglunid)" size="medium" >删除</el-button>
                </template>
            </el-table-column>
        </el-table>

        <!--分页组件 -->
        <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="currentPage"
                :page-sizes="pageSizes"
                :page-size="pageSize"
                layout="total, sizes, prev, pager, next, jumper"
                :total="total">
        </el-pagination>

        <!--删除按钮的弹出层-->
        <el-dialog
                title="提示"
                :visible.sync="delDialogVisible"
                width="350px"
        >

            <span>确认删除吗？</span>
            <span slot="footer" class="dialog-footer">
                <el-button @click="delDialogVisible = false">取 消</el-button>
                <el-button type="primary" @click="queren">确 定</el-button>
            </span>
        </el-dialog>


    </div>
</template>

<script>
    export default {
        name: "Message",
        data(){
            return{

                //删除提示框
                delDialogVisible:false,
                //删除的id
                delId:"",

                //当前显示的页码变量
                currentPage:1,
                pageSizes:[5,10,15],
                pageSize:5,
                //总条数
                total:0,

                //模糊查询评论时间
                SearchForm:{},
                //用户评论表格
                SayTable:[],
                //
                roleId:"",
            }
        },
        created() {
            this.initTable();
        },
        methods:{
            // 表头样式
            getRowClass() {
                return "background:#4841C1; color:#fff;";
            },
            //确认删除按钮
            queren(){
                var shanid=this.delId;
                this.shan(shanid);
            },
            //删除按钮触发的事件
            shan(id){
                this.$http.post("/pinglun/pinglun/del?id="+id).then(result=>{
                    this.initTable();
                    this.delDialogVisible=false;
                    this.initTable();
                })
            },

            //清空模糊查询表单
            reback(){
                this.SearchForm={};
                this.initTable();
            },


            //每页显示的条数大小改变时触发的方法
            handleSizeChange(val) {
                this.pageSize=val;
                this.initTable();
            },
            //页码改变时触发的方法
            handleCurrentChange(val) {
                this.currentPage=val;
                this.initTable();
            },

            //查询所有评论
            initTable(){
                var token=sessionStorage.getItem("token");
                this.$http.post("/pinglun/pinglun/selectAll?currentPage="+this.currentPage+"&pageSize="+this.pageSize+"&token="+token,this.SearchForm).then(result=>{
                    console.log("查看评论")
                    console.log(result)
                    if (result.data.code===2000){
                        this.SayTable=result.data.data.pageInfo.list;
                        this.total = result.data.data.pageInfo.total;
                        this.roleId=result.data.data.roleid;
                    }

                })
            },
            //删除评论
            del(id){
                this.delDialogVisible=true;
                this.delId=id;
            }
        }

    }
</script>

<style scoped>

</style>